<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>结算页</title>
    <link rel="stylesheet" href="./icon/01-r-iconfont/iconfont.css">
    <link rel="stylesheet" href="./css/06-accounts.min.css">
    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
</head>
<body>
    <div class="web">
        <header>
            <h1>填写订单</h1>
        </header>

        <main>
            <!-- 填写配送信息 -->
            <div class="carry-info">
                <table>
                    <tr>
                        <td>收货信息</td>
                        <td>请选择收货信息</td>
                    </tr>
                    <tr>
                        <td>送达日期</td>
                        <td>请填写送达日期</td>
                    </tr>
                    <tr>
                        <td>配送时间</td>
                        <td>不限时段</td>
                    </tr>
                    <tr>
                        <td>配送方式</td>
                        <td>市区免费配送</td>
                    </tr>
                </table>
            </div><!-- 填写配送信息 -->

            <!-- 订购人信息 -->
            <div class="person-info">
                <table>
                    <tr>
                        <td>订购人信息</td>
                        <td>请填写</td>
                    </tr>
                </table>
            </div><!-- 订购人信息 -->

            <!-- 留言板块 -->
            <div class="message-banner">
                <div class="card-message">
                    <h3>贺卡留言</h3>
                    <textarea name="" id="" cols="45" rows="10" style="resize: none;" placeholder="选填 请输入贺卡留言!"></textarea>
                </div>
                <div class="buyer-message">
                    <h3>买家留言</h3>
                    <textarea name="" id="" cols="45" rows="10" style="resize: none;" placeholder="选填 请输入买家留言!"></textarea>
                </div>
            </div><!-- 留言板块 -->

            <div class="other-product">
                <div class="desc">
                    <img src="./img/01-index/8.png" alt="">
                    <p>永恒回忆<br/>x1</p>
                </div>
                <div class="price">￥329</div>
            </div>

            <!-- 支付方式 -->
            <div class="pay-method">
                <h4>支付方式</h4>
                <div class="wechat"><i class="iconfont icon">&#xe650;</i> 微信</div>
                <div class="alipay"><i class="iconfont icon">&#xe634;</i> 支付宝</div>
            </div>

            <!-- 发票 -->
            <div class="bill">
                <!-- <p>发票</p>
                <p>选填</p> -->
                <table>
                    <tr>
                        <td>发票</td>
                        <td>选填</td>
                    </tr>
                </table>
            </div>

            <!-- 运费 -->
            <div class="fare">
                <table>
                    <tr>
                        <td>共 1 件商品</td>
                        <td>优惠: -￥</td>
                    </tr>
                    <tr>
                        <td>运费:￥0</td>
                        <td>商品总价: <span>￥ 329.00</span></td>
                    </tr>
                </table>
            </div><!-- 运费 -->
            <div class="empty"></div>
        </main>
        <div class="tabbar">
            <div class="actual-payment">实付款:￥329.00</div>
            <div class="pay-btn">提交订单</div>
        </div>
    </div>
</body>
</html>